<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html>
    <head>
    	<meta charset="utf-8">
	    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	    <meta name="viewport" content="width=device-width, initial-scale=1">
		<!-- basic styles bootstrap & fontawesome -->
        <link type="text/css" rel="stylesheet" href="${ctx}/static/bootstrap/css/bootstrap.min.css"/>       
        <link type="text/css" rel="stylesheet" href="${ctx}/static/ace/css/font-awesome.min.css"/>     
        <!--[if IE 7]>
		  <link rel="stylesheet" href="${ctx}/static/ace/css/font-awesome-ie7.min.css" />
		<![endif]--> 
		
		<link rel="stylesheet" href="${ctx}/static/ace/css/ace.min.css" />
		<link rel="stylesheet" href="${ctx}/static/ace/css/ace-rtl.min.css" />
		
		<!--[if lte IE 9]>
		  <link rel="stylesheet" href="${ctx}/static/ace/css/ace-ie.min.css" />
		<![endif]-->
		
		<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!--[if lt IE 9]>
		<script src="${ctx}/static/ace/js/html5shiv.js"></script>
		<script src="${ctx}/static/ace/js/respond.min.js"></script>
		<![endif]-->
		<title>后台管理系统-登录</title>
	</head>
	<body class="login-layout">
		<div class="main-container">
			<div class="main-content">
				<div class="row">
					<div class="col-sm-10 col-sm-offset-1">
						<div class="login-container">
							<div class="center">
								<h1>
									<i class="icon-leaf green"></i>
									<span class="red">BASIC</span>
									<span class="white">后台管理系统</span>
								</h1>
								<!-- <h4 class="blue">&copy; Company Name</h4> -->
							</div>

							<div class="space-6"></div>

							<div class="position-relative">
								<div id="login-box" class="login-box visible widget-box no-border">
									<div class="widget-body">
										<div class="widget-main">
											<h4 class="header blue lighter bigger">
												<i class="icon-coffee green"></i>
												请输入用户信息
											</h4>

											<div class="space-6"></div>

											<form method="post" onsubmit="return login();">
												<fieldset>
													<label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="text" class="form-control" placeholder="Username" id="username" name="username" value="<shiro:principal/>"/>
															<i class="icon-user"></i>
														</span>
													</label>

													<label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="password" class="form-control" placeholder="Password" id="password" name="password"/>
															<i class="icon-lock"></i>
														</span>
													</label>

													<div class="space"></div>

													<div class="clearfix">
														<label class="inline">
															<input type="checkbox" class="ace" value="true"/>
															<span class="lbl"> 记住我 </span>
														</label>

														<button type="submit" class="width-35 pull-right btn btn-sm btn-primary">
															<i class="icon-key"></i>
															登录
														</button>
													</div>

													<div class="space-4"></div>
												</fieldset>
											</form>

										</div><!-- /widget-main -->

									</div><!-- /widget-body -->
								</div><!-- /login-box -->
								
							</div><!-- /position-relative -->
						</div>
					</div><!-- /.col -->
				</div><!-- /.row -->
			</div>
		</div><!-- /.main-container -->
		
	<%@include file="/WEB-INF/pages/common/basic-scripts.jspf" %>  
	<script>
		$(function() {
			var msg = '${error}';
			if (!isEmpty(msg)) {
				defaultAlert(msg);
        		return false;
			}
		});
		
		function login() {
			var username = $("#username").val();
        	if (isEmpty(username)) {
        		defaultAlert("用户名不能为空");
        		return false;
        	}
        	var password = $("#password").val();
        	if (isEmpty(password)) {
        		defaultAlert("密码不能为空");
        		return false;
        	}
        	loading();
        	return true;
		}
	</script>
	</body>
</html>